<template>
  <div>
    <!-- 第三页模态框 -->
    <el-dialog title="人员详情" :visible="visible" width="50%" @close="closeFn">
      <!-- 个人数据 -->
      <el-form
        :label-position="labelPosition"
        label-width="100px"
        style="width: 80%"
        :model="getlist"
      >
        <el-form-item label="人员姓名">
          <el-input v-model="getlist.userName" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="角色">
          <el-input v-model="getlist.roleName" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="联系电话">
          <el-input v-model="getlist.mobile" :disabled="true"></el-input>
        </el-form-item>
      </el-form>
      <!-- 表格 -->
      <el-descriptions
        class="margin-top"
        title=""
        :column="2"
        direction="vertical"
      >
        <el-descriptions-item label="总工单数" colon="false"
          >{{getlist.total}}</el-descriptions-item
        >
        <el-descriptions-item label="拒绝工单">{{getlist.cancelCount}}</el-descriptions-item>
        <el-descriptions-item label="完成工单">{{getlist.workCount}}</el-descriptions-item>
        <el-descriptions-item label="进行中工单">{{getlist.progressTotal}}</el-descriptions-item>
      </el-descriptions>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeFn">返 回</el-button>
        <!-- <el-button type="primary" @click="centerDialogVisible = false"
          >确 定</el-button
        > -->
      </span>
    </el-dialog>
  </div>
</template>

<script>
// import { gettask } from "@/api/personnel";
export default {
  name: 'aa-v',
  props: {
    visible: {
      type: Boolean,
      required: false
    }
  },

  data () {
    return {
      centerDialogVisible: false,
      formLabelAlign: {
        name: '',
        region: '',
        type: ''
      },
      getlist: {}, // 表单数据
      // workLi: {
      //   userId: "",
      //   start: "2020-10-01 00:00:00",
      //   end: "2020-10-31 00:00:00",
      // },
      labelPosition: 'right',
      wwList: {}
    }
  },
  created () {
    // this.gettask();
  },
  methods: {
    // async gettask() {
    //   // 获取数据 服务器错误
    //   const arr = await gettask(this.workLi);
    //   this.wwList = arr;
    //   console.log(this.wwList);
    // },
    closeFn () {
      // 关闭模态框 清空表单
      // this.$refs.ruleForm.resetFields();
      this.$emit('update:visible', false)
    }
  }
}
</script>

<style long="scss" scoped>
.margin-top.el-descriptions {
  margin-left: 40px;
}
</style>
